---
title: Group
description: Used to group and attach elements together
links:
  source: components/group
  storybook: components-group--basic
---

<ExampleTabs name="group-basic" />

## Usage

```jsx
import { Group } from "@chakra-ui/react"
```

```jsx
<Group>
  <div />
  <div />
</Group>
```

## Examples

### Button

Here's an example of using the `Group` component to group buttons together.

<ExampleTabs name="group-with-button" />

### Attached

Use the `attached` prop to attach the children together.

<ExampleTabs name="group-with-attached" />

### Grow

Use the `grow` prop to make the children grow to fill the available space.

<ExampleTabs name="group-with-grow" />

## Props

<PropTable component="Group" part="Group" />
